import * as mobx from 'mobx'
import * as MobxReact from 'mobx-react'
import Grid from "./grid";
import React from "react";
import {IGridCellRenderParam} from "./grid_type";
import {Checkbox} from "antd";
import _ from 'lodash'
import {toJS} from "mobx";

interface CheckboxVJsonProp extends IGridCellRenderParam {
    $context: any

    colDef: {
        /**
         * 勾选状态保存至 scope 指定的实体属性中，规则是: [id1, id2, id3}
         */
        bind: string
        /**
         * 渲染单元格时，设定默认选中状态，状态如果返回为 true， 会自动写入 bind
         */
        defaultCheck?: (param: IGridCellRenderParam) => boolean | undefined
        /**
         * 获取 checkbox 的禁用状态
         */
        checkboxDisabled?: (param: IGridCellRenderParam) => boolean
        /**
         * 勾选状态发生变化时，会回调
         */
        onCheckboxChange?: (param: IGridCellRenderParam, rowId: string, checked: boolean) => void
    }

    grid: Grid
}

interface CheckboxVJsonState {

}

export default class CheckboxVJsonRender extends React.Component<CheckboxVJsonProp, CheckboxVJsonState> {

    toString(): any {
        return 'CheckboxVJsonRender ' + this.props.column.getColId()
    }

    getRowId(data: any) {
        return this.props.grid._getIdByRow(data)
    }

    getRow() {
        const origin = toJS(this.props.data)
        const id = this.getRowId(origin)
        const v = this.props.grid.getRowById(id)
        if (v) {
            return v
        }
        else {
            return origin
        }
    }

    getCheckedState(): boolean {
        if (!this.props.colDef.bind) {
            throw new TypeError(`所有 view === 'checkbox' 的列必须指定一个绑定目标 bind=[mobx]`)
        }

        const myState: string[] = _.get(this.props.$context.scopeInstance, this.props.colDef.bind)
        const rowId = this.getRowId(this.getRow())
        return (_.findIndex(myState, (v) => this.getRowId(v) === rowId) >= 0)
    }

    getDisableState(): boolean {
        if (typeof this.props.colDef.checkboxDisabled === 'function') {
            return this.props.colDef.checkboxDisabled.call(this.props.grid, this.props)
        }
        return false
    }

    onChange(event: any) {
        if (!this.props.colDef.bind) {
            throw new TypeError(`所有 view === 'checkbox' 的列必须指定一个绑定目标 bind=[mobx]`)
        }

        const myState: string[] = _.get(this.props.$context.scopeInstance, this.props.colDef.bind)
        this.props.grid.checkedRows = myState
        const checked = event.target.checked
        const row = this.getRow()
        const rowId = this.getRowId(row)

        if (checked) {
            if (!myState) {
                _.set(this.props.$context.scopeInstance, this.props.colDef.bind, [row])
            } else {
                if (_.findIndex(myState, (v) => this.getRowId(v) === rowId) < 0) {
                    myState.push(row)
                }
            }

        } else {
            _.remove(myState, (v) => this.getRowId(v) === rowId)
        }

        if (typeof this.props.colDef.onCheckboxChange === 'function') {
            this.props.colDef.onCheckboxChange.call(this.props.grid, this.props, rowId, checked)
        }
    }

    render() {
        return (
            <MobxReact.Observer>{
                () => (
                    <Checkbox
                        disabled={this.getDisableState()}
                        // defaultChecked={this.getDefaultChecked()}
                        checked={this.getCheckedState()}
                        onChange={this.onChange.bind(this)}
                    />
                )
            }</MobxReact.Observer>
        )
    }
}